<template>
  <div id="login" class="login">
    <yd-navbar slot="navbar" fixed>
      <a @click="$router.go(-1)" slot="left">
        <yd-navbar-back-icon></yd-navbar-back-icon>
      </a>
      <span slot="center" style="font-size:18px;">登录</span>
    </yd-navbar>

    <div class="content-login" slot>

      <div id="logo">
        <img src="../../assets/images/welcome.png">
      </div>


      <yd-cell-group>
        <yd-cell-item>
          <span slot="left">用户名：</span>
          <yd-input slot="right" required v-model.trim="username" max="20" placeholder="请输入用户名"></yd-input>
        </yd-cell-item>
        <yd-cell-item>
          <span slot="left">密码：</span>
          <yd-input slot="right" type="password" v-model.trim="password" placeholder="请输入密码"></yd-input>
        </yd-cell-item>
        <div class="space-20">
        </div>
        <yd-checkbox v-model="checkbox">记住密码</yd-checkbox>

        <yd-button size="large" bgcolor="#2196f3" color="#fff" @click.native="login">登录</yd-button>

      </yd-cell-group>
      <div class="space-20">
      </div>
      <router-link to="/user/register">没有账号，点我注册！=></router-link>
   
    </div>

  </div>
</template>

<script>
  import axios from '../../axios'
  import baseService from '../../axios/'

  export default {
    name: 'login',
    data() {
      return {
        msg: ' 密码错误，尝试找回密码 ',
        username: '',
        password: '',
        checkbox: false,
        passwordOld: '',
        passwordNew: ''
      }
    },
    computed: {
      userInfo () {
	      return this.$store.store.state.userInfo
      }
    },
    methods: {
    // login: function () {
    //   baseService.post('/user/login.do', {username: this.username, password: this.password}).then((res) => {
    //     this.msg = res.data.msg
    //   })
    // }
      login: function () {
        let param = new URLSearchParams();
        // console.log(this.username);
        let username = this.username;
        let password = this.password;
        param.append("username", username);
        param.append("password", password);
        baseService.post('/user/login.do', param).then((res) => {
          this.$dialog.alert({
            mes: res.data.msg
          });
          if(res.data.status == 0){
            this.setuserInfo(res.data.data);
            console.log(this.$store.store.state.userInfo);
            this.$router.go(-1);
            this.$dialog.alert({
              mes: res.data.msg
            });
          }
        })
      },
      setuserInfo (userInfo){
          this.$store.store.commit('setuserInfo',userInfo)
      },
    }
  }

</script>

<style>
  
  .login {
    height: 100%;
    position: fixed;
    width: 100%;
  }
  .login .content-login{
    margin-top:13%;
    position: fixed;
    height:100%;
    width:100%;
  }
  #logo img{
    margin:50px auto;
  }

  .yd-checkbox{
    margin:20px;
    float:left;
  }
  .yd-checkbox-icon{
    width: 15px !important;
    height: 15px !important;
  }
  .yd-checkbox-text{
    font-size:12px;
  }


</style>
